﻿{% extends "app/layout.html" %}
{% load myfilter %}
{% block content %}

<div class="row text-center" style="padding: 0px;padding-right: 30px;padding-left: 30px;">
    <div class="col-md-12">
        <form id="search_form" method="get">
            <h1>习题搜索</h1>
            <div class="form-group">
                <div class="btn-group" data-toggle="buttons">
                    <label class="btn btn-success active">
	                    <input type="radio" checked name="search_type" value="title"> 标题
                    </label>
                    <label class="btn btn-success">
	                    <input type="radio" name="search_type" value="id"> ID
                    </label>
                    <label class="btn btn-success">
	                    <input type="radio" name="search_type" value="_id"> 编号
                    </label>
                </div>
                <div>
                    <input type="search" class="form-control" name="search_key" placeholder="请输入搜索内容" autofocus />
                </div>
            </div>
            <div class="form-group">
                <div class="btn-group-sm" data-toggle="buttons">
                    <label class="btn btn-primary active">
	                    <input type="radio" checked name="tag" value="0"> 全部
                    </label>
{% for t in tags %}
                    <label class="btn btn-primary">
	                    <input type="radio" name="tag" value="{{ t.id }}"> {{ t.name }}
                    </label>
{% endfor %}
                </div>
            </div>
            <div class="form-group">
                <div class="btn-group" data-toggle="buttons">
                    <label class="btn btn-info active">
	                    <input type="radio" checked name="difficulty" value="0"> 全部
                    </label>
                    <label class="btn btn-info">
	                    <input type="radio" name="difficulty" value="1"> 容易
                    </label>
                    <label class="btn btn-info">
	                    <input type="radio" name="difficulty" value="2"> 普通
                    </label>
                    <label class="btn btn-info">
	                    <input type="radio" name="difficulty" value="3"> 困难
                    </label>
                </div>
            </div>
            <div class="form-group">
                <button class="btn btn-warning" type="submit">搜索</button>
            </div>
        </form>
    </div>
</div>

<div class="list-group">
    <a href="#" class="list-group-item active">
        <h4 class="list-group-item-heading">
            习题列表
        </h4>
    </a>
{% for p in problems %}
    <a href="{% url 'question' %}?pid={{ p.p.id }}" class="list-group-item">
        <h4 class="list-group-item-heading">
            {{ p.p.id }}. {{ p.p.title }}
            <span class="badge pull-right badge-success">{{ p.p.accepted_number }} / {{ p.p.submission_number }}</span>
            <span class="badge pull-right badge-warning">{{ p.p.difficulty|difficulty_name }}</span>
            <span class="badge pull-right badge-error">{{ p.p.create_time|date:'Y-n-d' }}</span>
            {% for t in p.tags %}
            <span class="badge pull-right badge-info">{{ t.name }}</span>
            {% endfor %}
        </h4>
    </a>
{% endfor %}
</div>
<nav style="text-align:center">
    <ul class="pagination">
        {% for p in lines.paginator.page_range %}
            {% ifequal p lines.number %}
        <li class="active"><a href="#" onclick="return false;">{{ p }}</a></li>
            {% else %}
        <li><a href="{{ urlextra }}{{ p }}">{{ p }}</a></li>
            {% endifequal %}
        {% endfor %}
    </ul>
</nav>
{% endblock %}

{% block scripts %}
<script>
    function outputform() {
        var formData = {};
        var t = $('#search_form').serializeArray();
        $.each(t, function () {
            formData[this.name] = this.value;
        });
        console.log(JSON.stringify(formData));
    }
</script>
{% endblock %}